﻿@using Flagrum.Web.Features.AssetExplorer.Data
@inherits AssetExplorerComponent

<LoadingView Text="@LoadingMessage" IsLoading="@IsLoading" CssClass="flex flex-col h-full">
    <CascadingValue Value="this" Name="AssetExplorer">

        @AddressBarTemplate

        <!-- Header Row -->
        <div class="flex flex-row">
            <!-- File List Header -->
            <div class="bg-dark border-t border-b border-r border-dark-550 p-3" style="flex: 0 0 315px;">
                <div class="row">
                    <strong class="font-display flex-grow">@FileListHeaderDisplayName</strong>
                    @if (Parent.CurrentView == AssetExplorerView.GameView && ItemSelectedOverride == null)
                    {
                        if (FileList?.CurrentNode?.Name == "")
                        {
                            <span class="material-icons select-none cursor-pointer mr-6" style="font-size: 1rem" @onclick="ExportContextMenu.ExportCurrentFolder">drive_file_move</span>
                        }
                    }
                    <span class="material-icons select-none cursor-pointer mr-3 @(CurrentLayout == FileListLayout.ListView ? "text-accent1-100" : "text-grey-500")" style="font-size: 1rem" @onclick="() => SetCurrentLayout(FileListLayout.ListView)">list</span>
                    <span class="material-icons select-none cursor-pointer @(CurrentLayout == FileListLayout.TreeView ? "text-accent1-100" : "text-grey-500")" style="font-size: 1rem" @onclick="() => SetCurrentLayout(FileListLayout.TreeView)">account_tree</span>
                </div>
            </div>
            <!-- File List Header 2 -->
            @if (CurrentLayout == FileListLayout.TreeView)
            {
                <div class="bg-dark border-t border-b border-r border-dark-550 p-3" style="flex: 0 0 315px;">
                    <div class="row">
                        <strong class="font-display flex-grow">@(FileList?.CurrentNode == null ? "Game View" : FileList.CurrentNode.Name)</strong>
                    </div>
                </div>
            }
            <!-- Preview Header -->
            <div class="flex-grow bg-dark border-t border-b border-dark-550 row py-2 px-3">
                @if (Preview?.Item == null)
                {
                    <strong class="flex-grow font-display">@Localizer["NoFileSelected"]</strong>
                }
                else
                {
                    if (Preview.EarcRelativePath == "UNKNOWN")
                    {
                        <strong>@Preview.Item.Name</strong>
                    }
                    else
                    {
                        <Hyperlink Uri="@Preview.EarcUri" Text="@Preview.EarcRelativePath" CssClass="mt-0"/>
                    }
                }
            </div>
        </div>

        <!-- Content Row -->
        <div class="flex flex-row" style="flex: 1 1 auto; align-items: stretch; overflow: hidden;">
            @FileListTemplate
            <div class="flex flex-col bg-dark-600 overflow-y-auto" style="flex: 1 1 auto; height: 100%">
                <Preview @ref="Preview"/>
            </div>
        </div>

        <ExportContextMenu @ref="ExportContextMenu"/>

    </CascadingValue>
</LoadingView>